<template>
    <div class="app-container">
        <el-row style="margin-top: 5px">
            <el-col :span="12">
                <el-button>查询</el-button>
            </el-col>
            <el-col :span="12">
                <el-button icon="el-icon-search" type="primary" @click="getExcelList">查询</el-button>
                <el-button icon="el-icon-download" type="primary" @click="exportExcelList">导出</el-button>
            </el-col>
        </el-row>

        <el-row style="margin-top: 10px; margin-left: 10px">
            <el-col :span="24">
                <el-table
                    :data="tableData"
                    style="width: 100%"
                    height="350">
                    <el-table-column
                        fixed
                        prop="sid"
                        label="sid"
                        width="300">
                    </el-table-column>
                    <el-table-column
                        prop="name"
                        label="姓名"
                        width="120">
                    </el-table-column>
                    <el-table-column
                        prop="sClass"
                        label="班级"
                        width="120">
                    </el-table-column>
                    <el-table-column
                        prop="gender"
                        label="性别"
                        width="120">
                    </el-table-column>
                    <el-table-column
                        prop="age"
                        label="年龄"
                        width="120">
                    </el-table-column>
                    <el-table-column
                        :formatter="formatterTime"
                        prop="enrollmentDate"
                        label="入学日期"
                        width="150">
                    </el-table-column>
                    <el-table-column
                        :formatter="formatterTime"
                        prop="enrollmentDate"
                        label="入学日期"
                        width="150">
                    </el-table-column>
                    <el-table-column
                        :formatter="formatterTime"
                        prop="enrollmentDate"
                        label="入学日期"
                        width="150">
                    </el-table-column>
                    <el-table-column
                        :formatter="formatterTime"
                        prop="enrollmentDate"
                        label="入学日期"
                        width="150">
                    </el-table-column>
                    <el-table-column
                        :formatter="formatterTime"
                        prop="enrollmentDate"
                        label="入学日期"
                        width="150">
                    </el-table-column>
                    <el-table-column
                        :formatter="formatterTime"
                        prop="enrollmentDate"
                        label="入学日期"
                        width="150">
                    </el-table-column>
                    <el-table-column
                        :formatter="formatterTime"
                        prop="enrollmentDate"
                        label="入学日期"
                        width="150">
                    </el-table-column>
                </el-table>
            </el-col>
        </el-row>
    </div>
</template>

<script>
import {excelList, getExcelList, exportExcelList} from "@/api/system/excel";

import Treeselect from "@riophae/vue-treeselect";

export default {
    name: "Excel",
    // dicts: ['sys_normal_disable', 'sys_user_sex'],
    // components: {Treeselect},
    data() {
        return {
            tableData: []
        };
    },
    watch: {},
    created() {

    },
    methods: {
        /** 查询列表 */
        getExcelList() {
            this.loading = true;
            excelList().then(response => {
                    this.tableData = response.rows;
                }
            );
        },
        exportExcelList() {
            this.download('system/student/export', {
                // ...this.queryParams
            }, `role_${new Date().getTime()}.xlsx`)
        },
        // 截取时间 只展示年月日
        formatterTime(row, column) {
            let data = row[column.property]
            return /\d{4}-\d{1,2}-\d{1,2}/g.exec(data)
        },
    }
};
</script>

<style>

</style>
